<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="<%=basePath%>Js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="<%=basePath%>css/mycss/bootstrap.min.css" />
        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">

//条件查询会员信息
function selectClient(){
	
	var clientNumber="";
	var clientfName="";
	var clientIdnum="";
	clientNumber = $("#clientNumber").val();
	clientfName = $("#clientfName").val();
	clientIdnum = $("#clientId").val();
	
	window.location.href="selectClient.do?clientNumber="+clientNumber+"&clientfName="+clientfName+"&clientIdnum="+clientIdnum;
	
}

//删除会员
function deleteVip(id){
	if(confirm("是否确定删除？")){
		$.ajax({
			type:"post",
			url:"deleteVip.do",
			data:{
				"id":id,
			},
			dataType:"text",
			success:function(result){
				
				if(result == "1"){
					var del = $("#"+id+"");
					
					alert("删除成功")
					del.remove();
				}else{
					alert("删除失败")
				}
				
			},
			error:function(){
				alert("系统故障")
			}
		})
	}else{
		alert("操作已取消")
	}
	
}

//查看详细信息
function queryVipInf(number){
	
	$.ajax({
		type:"post",
		url:"selectvipByNumber2.do",
		data:{
			"number":number,
		},
		success:function(result){
			stus = JSON.parse(result)
			
			var str = "";
			for(var i = 0; i < stus.length; i++ ){
				
				str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
				str +="<tr><td width='30%' class='tableleft'>卡号</td>"
				str +="<td><input disabled='disabled' type='text' name='stafNumber' value="+stus[i].number+" id='stafNumber2' class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>姓名</td>"
				str +="<td><input disabled='disabled' type='text' name='stafName' value="+stus[i].name+" id='stafName2' class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>性别</td>"
				str +="<td><input disabled='disabled' type='text' name='product' id='stafIdNumber2' value="+stus[i].gender+" class='form-control' style='width:100%'/></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>年龄</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='staAddress2' value="+stus[i].age+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>出生年月日</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafJobtitle2' value="+stus[i].reserved1+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>会员等级</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafGender2' value="+stus[i].grade+" class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>身份证号</td>"
				str +="<td><input disabled='disabled'  type='text' name='classify' id='stafAge2' value="+stus[i].idnumber+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>居住地址</td>"
				str +="<td><input disabled='disabled' type='text' name='classify' id='stafJurisdiction2' value="+stus[i].address+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>电话号码</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafWorktime2' value="+stus[i].phone+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>余额</td>"
				str +="	<td><input disabled='disabled' type='text' name='stafHiredate' id='stafHiredate2' value="+stus[i].money+"￥ class='form-control' style='width:100%'' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>备注</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafPhone2' value="+stus[i].remark+" class='form-control' style='width:100%'' /></td></tr>"
				str +="</table>"

			}	
			stu = "<h3 class='modal-title'  align='center'>会员详细信息</h3>";
			$("#myModalLabel").empty( );
			$("#Inf").empty( );
			$("#xiugai").empty( );
			$("#Inf").html(str);
			$("#myModalLabel").html(stu);
		},
		error:function(){
			alert("系统故障")
		}
	})
	
}

//修改信息模态框显示
function getVipInf(vipNumber){
	
	$.ajax({
		type:"post",
		url:"selectvipByNumber2.do",
		data:{
			"number":vipNumber,
		},
		success:function(result){
			
stus = JSON.parse(result)
			
			var str = "";
			for(var i = 0; i < stus.length; i++ ){
				
				str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
				str +="<tr><td width='30%' class='tableleft'>卡号</td>"
				str +="<td><input disabled='disabled' type='text' name='vipfNumber2' value="+stus[i].number+" id='vipfNumber2' class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>姓名</td>"
				str +="<td><input type='text' name='vipName2' value="+stus[i].name+" id='vipName2' class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>性别</td>"
				str +="<td><input type='text' name='vipgender2' id='vipgender2' value="+stus[i].gender+" class='form-control' style='width:100%'/></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>年龄</td>"
				str +="	<td><input type='text' name='vipage2' id='vipage2' value="+stus[i].age+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>出生年月日</td>"
				str +="	<td><input disabled='disabled' type='text' name='vipBrith2' id='vipBrith2' value="+stus[i].reserved1+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>会员等级</td>"
				str +="	<td><input disabled='disabled' type='text' name='vipgrade2' id='vipgrade2' value="+stus[i].grade+" class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>身份证号</td>"
				str +="<td><input type='text' name='vipidnumber2' id='vipidnumber2' value="+stus[i].idnumber+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>居住地址</td>"
				str +="<td><input type='text' name='vipaddress2' id='vipaddress2' value="+stus[i].address+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>电话号码</td>"
				str +="	<td><input type='text' name='vipphone2' id='vipphone2' value="+stus[i].phone+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>余额</td>"
				str +="	<td><input disabled='disabled' type='text' name='vipmoney2' id='vipmoney2' value="+stus[i].money+"￥ class='form-control' style='width:100%'' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>备注</td>"
				str +="	<td><input type='text' name='vipremark2' id='vipremark2' value="+stus[i].remark+" class='form-control' style='width:100%' /></td></tr>"
				str +="</table>"

			}	
			stu = "<h3 class='modal-title'  align='center'>修改会员信息</h3>";
			stu2 = "<button type='button' onclick='updataVip()' class='btn btn-success'>修改</button>"
			$("#myModalLabel").empty( );
			$("#Inf").empty( );
			$("#Inf").html(str);
			$("#myModalLabel").html(stu);
			$("#xiugai").html(stu2);
		},
		error:function(){
			alert("系统故障")
		}
	})
}

//修改会员信息
function updataVip(){
	
	var vipNumber = $("#vipfNumber2").val();
	var vipName = $("#vipName2").val();
	var vipgender = $("#vipgender2").val();
	var vipage = $("#vipage2").val();
	var vipidnumber = $("#vipidnumber2").val();
	var vipaddress = $("#vipaddress2").val();
	var vipphone = $("#vipphone2").val();
	var vipremark = $("#vipremark2").val();
	
	$.ajax({
		type:"post",
		url:"updateVip.do",
		data:{
			"vipName":vipName,
			"vipgender":vipgender,
			"vipage":vipage,
			"vipidnumber":vipidnumber,
			"vipaddress":vipaddress,
			"vipphone":vipphone,
			"vipremark":vipremark,
			"vipNumber":vipNumber,
			
		},
		dataType:"text",
		success:function(result){
			if(result == "1"){
				alert("修改成功")
			}else{
				alert("修改失败")
			}
		},
		error:function(){
			alert("系统故障")
		}
	})
	
	
	
}

</script>
</head>
<script type="text/javascript" src="<%=basePath%>Js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="<%=basePath%>css/mycss/bootstrap.min.css" />
<body>
<hr><h3 align="center">会员列表</h3><hr>
<table >
<tr><td>会员卡号:</td><td><input type="text" name="clientNumber" id="clientNumber" class="form-control" placeholder="请输入会员卡号" value=""></td>
<td>姓名:</td><td><input type="text" name="clientfName" id="clientfName" class="form-control" placeholder="请输入姓名" value=""></td>
<td>身份证号码:</td><td><input type="text" name="clientId" id="clientId" class="form-control" placeholder="请输入身份证号" value=""></td>
<td><button class="btn btn-primary" onclick="selectClient()">查询</button></td>
</tr>
</table><br>

<table border="1" class="table table-bordered" id="Viptable">
<tr><th>卡号</th><th>姓名</th><th>性别</th><th>年龄</th><th>会员等级</th><th>身份证号</th><th>电话号码</th><th>卡内余额</th><th>操作</th></tr>
<c:forEach items="${pageInfo.list}" var="clientList">
<tr id="${clientList.id}">
<td>${clientList.number}</td><td>${clientList.name}</td><td>${clientList.gender}</td><td>${clientList.age}</td>
<td>${clientList.grade}</td><td>${clientList.idnumber}</td>
<td>${clientList.phone}</td><td>${clientList.money}</td>
<td>
<a onclick="deleteVip('${clientList.id}')" href="#">删除</a>&nbsp;&nbsp;
<a href="" onclick="queryVipInf('${clientList.number}')" data-toggle="modal" data-target="#myModal">查看详细信息</a>&nbsp;&nbsp;
<a href="" onclick="getVipInf('${clientList.number}')" data-toggle="modal" data-target="#myModal">修改信息</a>
</td>
</tr>

</c:forEach>
</table>

     <c:if test="${inf eq null}">
	<div id="page1">
	<c:if test="${!pageInfo.isFirstPage }">
					<a href="${pageContext.request.contextPath }/queryVipAll.do">首页</a>
					<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.prePage}">上一页</a>
				</c:if>
				<c:if test="${!pageInfo.isLastPage }">
				<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.nextPage}">下一页</a>
				<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.lastPage}">末页</a>
				</c:if>
				当前页：${pageInfo.pageNum }/${pageInfo.pages }.
	</div>
	</c:if>
	
	 <c:if test="${!(inf eq null)}">
	<div id="page1">
	<c:if test="${!pageInfo.isFirstPage }">
					<a href="${pageContext.request.contextPath }/queryVipAll.do?clientNumber=${clientNumber}&clientfName=${clientfName}&clientIdnum=${clientIdnum}">首页</a>
					<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.prePage}&clientNumber=${clientNumber}&clientfName=${clientfName}&clientIdnum=${clientIdnum}">上一页</a>
				</c:if>
				<c:if test="${!pageInfo.isLastPage }">
				<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.nextPage}&clientNumber=${clientNumber}&clientfName=${clientfName}&clientIdnum=${clientIdnum}">下一页</a>
				<a href="${pageContext.request.contextPath }/queryVipAll.do?pageNum=${pageInfo.lastPage}&clientNumber=${clientNumber}&clientfName=${clientfName}&clientIdnum=${clientIdnum}">末页</a>
				</c:if>
				当前页：${pageInfo.pageNum }/${pageInfo.pages }.
	</div>
	</c:if>
	
					<!-- 模态框（Modal） -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
					</div>
					<div id="myModalLabel">
					
					</div>
					<div class="modal-body" id="Inf">
						
					</div>
					<div class="modal-footer" id="xiugai">
					
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
		</div>
		
		

</body>
</html>